<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS Border 绘制平行四边形</title>

<style>
	.div_class1{
		border: 100px solid;
		width: 0;
		height: 0;
		border-color: transparent transparent green transparent;
		margin: 50px auto;  
	}
	.div_class2{
		width: 200px;
		height: 120px;
		transform:skew(-30deg);
		background-color: red;
		margin: 50px auto;
	}
	.div_class3{
		width: 200px;
		height: 200px;
		border-radius:50%;
		background-color: blue;
		margin: 50px auto;
	}
</style>
</head> <body> <div class="div_class1"></div>
		<div class="div_class2"></div>
		<div class="div_class3"></div> </body>
</html>

